<template>
  <div style="background: #f2f2f2;padding: 4px 12px;border-radius: 4px;">
    文本内容：<input type="text" :value="props?.material?.props?.content" @change="(ev) => handleChange((ev.target as HTMLInputElement).value)">
  </div>
</template>

<script setup lang="ts">
import {defineProps, defineEmits} from "vue";
import {MaterialType} from "@/types/material.type";
const props = defineProps<{material:MaterialType}>();
const emit = defineEmits<{(event: 'change', material: MaterialType):void}>();
const handleChange = (content: any) =>{
  const newMaterial = {...props?.material, props:{content}}
  emit('change', newMaterial);
}
</script>

<style scoped>

</style>
